window.onload = function () {
    let canvas = document.querySelector('canvas');
    let context = canvas.getContext('2d');
    let w = window.innerWidth;
    let h = window.innerHeight;
    canvas.width = w;
    canvas.height = h;

    let num = Math.random() * 150 + 1;
    let snows = [];
    for (let i = 0; i < num; i++) {
        snows.push({
            x: Math.random() * w,
            y: Math.random() * h,
            r: Math.random() * 4 + 1
        });
    }
    let move = () => {
        for (let i = 0; i < num; i++) {
            let snow = snows[i];
            snow.x += Math.random() * 2 + 1;
            snow.y += Math.random() * 2 + 1;
            if (snow.x > w) {
                snow.x = 0;
            }
            if (snow.y > h) {
                snow.y = 0;
            }
        }
    }
    let draw = () => {
        context.clearRect(0, 0, w, h);
        context.beginPath();
        context.fillStyle = 'lightskyblue';
        context.shadowColor = 'white';
        context.shadowBlur = 30;

        for (let i = 0; i < num; i++) {
            let snow = snows[i];
            context.moveTo(snow.x, snow.y);
            context.arc(snow.x + 60, snow.y + 60, snow.r, 6, Math.PI * 2);
        }
        context.fill();
        context.closePath();
        move();
    }
    draw();
    setInterval(draw, 15);
}